<link rel="stylesheet" href="templates/demo/dynamicTable/css/tableDemo.css" />
<div class="pd14 vany_authority">
	<div class="vany_treeTable pd14" id="authority">
		<!--面包屑-->
		<div class="pb10" id="crumbs">
			<el-breadcrumb separator="/">
				<el-breadcrumb-item :to="{ path: '/' }">DEMO</el-breadcrumb-item>
				<el-breadcrumb-item>列表DEMO</el-breadcrumb-item>
			</el-breadcrumb>
			<i-favorite></i-favorite>
		</div>
		<div id="treeTable" class="treeTable">
			<!-- 树 -->
            <div id="treeLeft" class="vanytree i1">
            	<div style="position:relative;">
            		<div class="elInput">
            			<el-input placeholder="输入关键字进行过滤" v-model="filterText" icon="search">
				        </el-input>
				    </div>
			        <h1 class="treetitle" v-once>
			        	<span v-html="icon"></span>
			        	<span>数据类型</span>
			        	<span @click="rightIconClick" v-html="rightIcon" style="position: absolute; right: 20px; cursor: pointer;"></span>
			        </h1>
			        <el-tree :default-expanded-keys="defaultExpandedKeys" class="filter-tree" :data="data" :node-key="defaultProps.id" :props="defaultProps" highlight-current :expand-on-click-node="false" @node-click="handleNodeClick" :filter-node-method="filterNode" ref="tree">
			        </el-tree>
			        <el-dropdown :hide-on-click="false" @command="handleCommand" style="display:none" ref="contexts" trigger="click" v-if="contexts" @visible-change="showContexts">
			        	<span class="el-dropdown-link">
			        		<i class="el-icon-caret-bottom"></i>
			        	</span>
			        	<el-dropdown-menu class="vanytree-contexts" slot="dropdown">
			        		<el-dropdown-item v-for="(context, index) in contexts" :key="context.name" :command="''+index" divided :disabled="context.disabled" :authority="context.authority">{{context.name}}</el-dropdown-item>
			        	</el-dropdown-menu>
			        </el-dropdown>
            		<div class="moveline"></div>
            	</div>
            </div>
            <!-- 表格 -->
            <div id="tableR" class="item i2">
				<!--表格-->
				<div class="item i2" id="table">
					<div class="pd14">
		                   <el-row :gutter="8">
		                       <el-col :span="16">
		                           <el-form :inline="true"  class="demo-form-inline">
		                               <el-form-item  style="margin-bottom: 0px" >
		                                   <el-input placeholder="请输入您要搜索的内容" @keyup.enter.native="search":on-icon-click="search" style="border-radius: 0px" v-model="keyword" icon="search" ></el-input>
		                               </el-form-item>
		                           </el-form>
		                       </el-col>
		                       <el-col :span="8">
		                           <el-row type="flex" justify="end">
		                               <el-button type="primary" @click="addDic">添加数据</el-button>
		                           </el-row>
		                       </el-col>
		                   </el-row>
		               </div>
		
					<el-table ref="table" :data="tableData" v-loading="loading" style="width:100%;" ref="multipleTable" :height="tableHeight" @selection-change="handleSelectionChange">
						<el-table-column v-for="col in cols" show-overflow-tooltip :prop="col.colcode" :label="col.colname" >
                        </el-table-column>
						<el-table-column label="操作" width="100">
		                        <template scope="scope">
		                            <el-button type="text" size="small" @click="editDic(scope.row)">编辑</el-button><span style="color:#333;margin:0 0 0 5px">|</span>
		                            <el-button type="text" size="small" @click="deleteDic(scope.row)">删除</el-button>
		                        </template>
		                 </el-table-column>
					</el-table>
					
					
                     <el-pagination
                             @size-change="handleSizeChange"
                             @current-change="handleCurrentChange"
                             :current-page="pageIndex"
                             :page-sizes="[10, 20, 30]"
                             :page-size="pageSize"
                             layout="total, sizes, prev, pager, next, jumper"
                             :total="total">
                     </el-pagination>
		                       
				</div>
			</div>
		</div>
		<!-- 详细框 -->
		<div id="dialogInfos">
			<el-dialog title="DEMO列表详细信息" :visible.sync="dialogVisible" :before-close="handleClose">
				<el-form :model="tableForm" :rules="rules" ref="tableForm" label-width="140px" class="demo-ruleForm">
					<el-form-item label="列一:" prop="colOne" >
						<el-input :maxlength="10"  v-model="tableForm.colOne"   ></el-input>
					</el-form-item>
					<el-form-item label="列二:" prop="colTwo" >
						<el-input :maxlength="10"  v-model="tableForm.colTwo"  ></el-input>
					</el-form-item>
					<el-form-item label="列三:" prop="colThr" >
						<el-input :maxlength="10"  v-model="tableForm.colThr"  ></el-input>
					</el-form-item>
					<el-form-item>
						<el-button type="primary" @click="submitForm('tableForm')">确定</el-button>
						<el-button type="primary" @click="cancelForm('tableForm')">取消</el-button>
					</el-form-item>
				</el-form>
			</el-dialog>
		</div>
	</div>
</div>
<script type="text/javascript" src="templates/demo/dynamicTable/js/tableDemo.js?ts=new Date().getTime()"></script>
<script type="text/javascript" src="templates/authority/common/js/moveline.js?ts=new Date().getTime()"></script>